﻿<style type="text/css">
    /*好友详情*/
    body{background:#efeff3 }
    .mv-chat .fri-details .details-top{background: #fff;margin-top: 15px;}
    .mv-chat .details-top .fri-cont{display: -webkit-box;padding: 15px;}
    .mv-chat .details-top .fri-a{display: inline-block;}
    .mv-chat .details-top .fri-a img{width: 60px;height: 60px;display: inline-block;border-radius: 5px;}
    .mv-chat .details-top .fri-b {margin-left: 10px;}
    .mv-chat .details-top .fri-b h2{font-size: 16px;font-weight: 700;}
    .mv-chat .details-top .fri-b h2 i{margin-left: 10px;}
    .mv-chat .details-top .fri-b p{color:#999;font-size: 14px; }
    .mv-chat  .details-mid{background: #fff;margin-top: 15px;margin-bottom: 15px;}
    .mv-chat .details-mid a{display: block;padding-left: 15px;padding-right: 10px;height: 40px;line-height: 40px;}
    .mv-chat .details-mid a .fri-c{float: left;}
    .mv-chat .details-mid a .fri-d{float: right;font-size: 25px;color: #d6d8d7}
    .mv-chat .details-bottom{background: #fff;}
    .details-bottom .bottom-cont{margin-left: 15px;margin-right: 15px;border-bottom: 1px solid #f2f2f2;padding-top: 10px;padding-bottom: 10px;}
    .details-bottom .bottom-cont .fri-e{color: #666}
    .details-bottom .bottom-cont .fri-f{margin-left: 54px;color: #000}
    .details-bottom .bottom-album{margin-left: 15px;margin-right: 15px;border-bottom: 1px solid #f2f2f2;height: 60px;line-height: 60px;}
    .details-bottom .bottom-album a{display:block;}
    .details-bottom .bottom-album a i{float: right;font-size: 25px;color: #d6d8d7;}
    .details-bottom .bottom-album .fri-g {display: inline-block;margin-left: 15px;}
    .details-bottom .bottom-album .fri-g img{width: 40px;height: 40px;display: inline-block;margin-left: 10px;margin-top: 10px;}
    .details-bottom .bottom-album .fri-h{color: #666;} 
    .mv-chat .details-bottom  .bottom-more{height: 40px!important;line-height: 40px!important;}
    .mv-chat .fri-but{margin-left: 15px;margin-right: 15px;}
    .mv-chat .fri-but a{display: block;width: 100%;padding: 10px 0;text-align: center;margin-top: 15px;border-radius: 5px;}
    .mv-chat .fri-but a:nth-of-type(1){background:#51aa38;color: #fff }
    .mv-chat .fri-but a:nth-of-type(2){background:#51aa38;background: #fff;border: 1px solid #e7e7e7 }

    /*男女图标颜色*/
    .fri-b .boy{color:#68b5ea }
    .fri-b .girl{color:#fa6d1 }
</style>
<div class="mv-chat">
    <div class="fri-details">
        <div class="details-top">
            <div class="fri-cont">
                <div class="fri-a">
                    <img :src="bag.head" />
                </div>
                <div class="fri-b">
                    <h2><label v-text="bag.username"></label>
                        <i class="iconfont icon-mine boy" v-if="bag.sexs == 1"></i>
                        <i class="iconfont icon-mine girl" v-if="bag.sexs == 2"></i>
                    </h2>
                    <p>UID：<label v-text="bag.id"></label></p>
                    <p v-text="bag.sign">-</p>
                </div>
            </div>
        </div>
        <div class="details-mid">
            <a v-if="bag.isfriend == true" v-on:click="remark"><span class="fri-c">设置备注和标签</span><i class="iconfont icon-xiayibu fri-d"></i></a>
        </div>
        <div class="details-bottom">
            <div class="bottom-cont">
                <span class="fri-e">地区</span><span class="fri-f" v-text="bag.placename">-</span>
            </div>
            <!--<div class="bottom-album">
                <a href=""><span class="fri-h">个人相册</span><span class="fri-g"><img src="demo.jpg"><img src="demo.jpg"><img src="demo.jpg"></span><i class="iconfont icon-xiayibu"></i></a>
            </div>-->
            <div class="bottom-cont">
                <span class="fri-e">公司</span><span class="fri-f" v-text="bag.company">-</span>
            </div>
            <div class="bottom-cont">
                <span class="fri-e">学校</span><span class="fri-f" v-text="bag.school">-</span>
            </div>
            <div class="bottom-cont">
                <span class="fri-e">职业</span><span class="fri-f" v-text="bag.tradename">-</span>
            </div>
        </div>
        <div class="fri-but">
            <a v-if="bag.isfriend == true" v-on:click="chat">发送消息</a>
            <a v-if="bag.isfriend == true" v-on:click="del">删除好友</a>
            <a v-if="bag.isfriend == false && bag.ismy == false" v-on:click="add">添加好友</a>
            <a v-if="bag.ismy == true" onclick="mview.view.load('/views/User/setting_datum.html')">编辑资料</a>
        </div>
    </div>
</div>
<div style="height:60px;"></div>
<script type="text/javascript">
    var pagedata = {
        request: {
            method: "VIEW_FRIEND_DETAIL",
            id: mview.view.chlid.param.id
        },
        screen: {
            header_display: true,
            footer_display: false,
            header_title_name: "详细页面",
            header_exit_name: "返回",
            header_exit_click: function () {
                mview.view.back();
            }
        },
        data: {

        },
        methods: {
            remark: function () {
                mview.view.load('/views/module/friend/relationremarks.html', {
                    id: pagedata.request.id
                })
            },
            add: function () {
                mview.control.confirm("提示", "即将添加" + pagedata.data.bag.username + "为好友", function () {
                    mview.socket.send({
                        data: {
                            method: "FRIEND_RELATION_ADD",
                            objectid: mview.view.chlid.param.id,
                            explain: "请求成为您的好友"
                        },
                        success: function (data) {
                            if (data.Code == 0) {
                                mview.control.tips("申请成功");
                            }
                            else {
                                mview.control.tips(data.Message);
                            }
                        }
                    });
                });
            },
            del: function () {
                mview.control.confirm("提示", "确定删除好友" + pagedata.data.bag.username, function () {
                    mview.socket.send({
                        data: {
                            method: "FRIEND_RELATION_DELETE",
                            objectid: mview.view.chlid.param.id
                        },
                        success: function (data) {
                            if (data.Code == 0) {
                                mview.control.tips("删除成功");
                                pagedata.reload();
                            }
                            else {
                                mview.control.tips(data.Message);
                            }
                        }
                    });
                });
            },
            chat: function () {
                mview.view.load('/views/module/friend/message.html', {
                    id: mview.view.chlid.param.id
                });
            }
        }
    }
    mview.view.chlid.init(pagedata);
</script>